<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="../js/jquery.js"></script>
<script type="text/javascript" src="../js/ajaxfileupload.js"></script>
</head>
<body>
	<div id="fileList"></div>
	<div>
		<div id="test">
			<input type="file" id="file" name="file">
		</div>
		<button onclick="uploadFile()">上传文件</button>
	</div>
	<script type="text/javascript">
		var staff_name = "厉雨鑫";
		$(function(){
			getFileList();
		});
		
		function getFileList(){
			//file改变的监听事件
			$("#file").change(function(){
				uploadFile();
			})
			//加载所有文件
			$.ajax({
					type:"get",
					url:"../fileList",
					async:true,
					success:function(data){
						var obj = JSON.parse(data);
						var res = "";
						for(i in obj ){
							var res = res + "<p>"+"文件名："+ obj[i].foreName+ " 上传人："+ obj[i].uploader +" 上传时间："+obj[i].createDate+"<a href=\"../download?fileId="+ obj[i].id+  "\" target=\"view_window\" >下载</a></p>";
						}
						$("#fileList").append(res);
					}
				});
		}
		
		//上传文件
		function uploadFile(){
			// 开始上传文件时显示一个图片
				$.ajaxFileUpload({
					url: "../upload?"+"action_type=uploadFile&staff_name="+encodeURI(encodeURI(staff_name)),
				//	type: 'post',
					secureuri: false, //一般设置为false
					fileElementId: 'file', // 上传文件的id、name属性名
					dataType: 'application/json', //返回值类型
					//elementIds: elementIds, //传递参数到服务器
				
					success: function(data, status) {
						var res = data.split("<pre>");
						res = res[1].split("</pre>")
						data = res[0];
						alert(data);
						//重新添加input type=file
						$("#file").remove();
						$("#test").append("<input type=\"file\" id=\"file\" name=\"file\">");
						
						$("#fileList").children().remove();
						getFileList();
					},
					error: function(data, status, e) {
						alert("fail to send Message");
					}
				}); 
		}
	</script>
</body>
</html>